import { AuthorAuditApi, fetchAuthWorks } from '@/api/audit/auth/author'
import { GetAuthWorksReq } from '@/api/audit/auth/model/authorModel'
import useFormat from '@/hooks/serviceLogic/useFormat'
import { useStore } from '@/store'
import { formatTime } from '@/utils/timeHelper'
import { computed, reactive } from 'vue'
import { AuthMaterialListDialogState } from '../types'

const useGetAuthworks = () => {
  const store = useStore()
  const { formatTag } = useFormat()
  const authworksDialogState = reactive<AuthMaterialListDialogState>({
    visiable: false,
    tableData: [],
    tableColumns: [
      {
        title: '图片ID',
        dataIndex: 'id',
      },
      {
        title: '预览',
        dataIndex: 'image',
        customRender: ({ text }) => (
          <a-image width={100} height={50} src={text} />
        ),
      },
      {
        title: '标题',
        dataIndex: 'title',
      },
      {
        title: '内容',
        dataIndex: 'text',
      },
      {
        title: '分类',
        dataIndex: 'category_list',
        customRender: ({ text }) => {
          if (text && text.length > 0) {
            const strList = text.map((item: { name: string }) => item.name)
            return formatTag(strList, 'categories') as string
          } else {
            return '暂无'
          }
        },
      },
      {
        title: '创建时间',
        dataIndex: 'dateline',
        customRender: ({ text }) => formatTime(text),
      },
    ],
  })

  const openAuthWorksDialog = async (authId: string) => {
    const reqData: GetAuthWorksReq = {
      user_id: authId,
    }
    const { data } = await fetchAuthWorks(reqData)
    authworksDialogState.tableData = data
    authworksDialogState.visiable = true
  }
  const fetchAuthWorksLoading = computed(() =>
    store.getters['global/isOpLoading'](AuthorAuditApi.QUERY_AUTH_WORKS)
  )

  return { openAuthWorksDialog, fetchAuthWorksLoading, authworksDialogState }
}

export default useGetAuthworks
